博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Angular指令一
阅读量:5065 次
发布时间:2019-06-12

本文共 1134 字,大约阅读时间需要 3 分钟。

    Angular指令一
   
   通过AngularJS模块API中的 .directive() 方法,我们可以通过传入一个字符串和一个函数来 注册一个新指令。其中字符串是这个指令的名字,指令名应该是驼峰命名风格的(除了第一个单词外其他单词首 字母大写,中间不加空格),函数应该返回 一个对象。
 
指令内容:
 
  restrict 四种格式:元素(E)、属性(A)、类(C)或注释(M);
      scope:{   }独立隔离作用域,作用域之间不影响,意味着指令有了一个属于自己的 $scope 对象,这个对象只能在指令的方法中或指令的模板字符串中使用;
      controller:function(){} 指令可以有它自己的控制器指令内部创建方法给外部指令引用;
      link里面写指令内部的事件;
 
scope的绑定策略
 
   
   @   把当前属性作为字符串传递。还可以绑定来自外部scope的值,在属性值中插入{
{}}即可。当作用域中属性私有时@someAttr;
 
angular.module('myApp', []).directive('myDirective', function() {    return {    restrict: 'A',    replace: true,    scope: {        myUrl: '@', //绑定策略        myLinkText: '@' //绑定策略        },        template: '' +        '{
{myLinkText}}
' };});

结果如图

 
  =    与父scope中的属性进行双向绑定;
                

 

angular.module('myApp', []).directive('myDirective', function() {    return {    restrict: 'A',    replace: true,    scope: {    myUrl: '=someAttr', // 经过了修改    myLinkText: '@'    },    template: '\    
\
\
\
{
{myLinkText}}
\
' };});

结果如图

 

  &  传递一个来自父scope的函数,稍后调用;
 
  

转载于:https://www.cnblogs.com/xiaoluoli/p/6093460.html

你可能感兴趣的文章
Windows Phone开发(4):框架和页 转:http://blog.csdn.net/tcjiaan/article/details/7263146
查看>>
Unity3D研究院之打开Activity与调用JAVA代码传递参数(十八)【转】
查看>>
python asyncio 异步实现mongodb数据转xls文件
查看>>
TestNG入门
查看>>
【ul开发攻略】HTML5/CSS3菜单代码 阴影+发光+圆角
查看>>
虚拟中没有eth0
查看>>
[ZJOI2007]棋盘制作 【最大同色矩形】
查看>>
IOS-图片操作集合
查看>>
模板统计LA 4670 Dominating Patterns
查看>>
泛型第23条:请不要在新代码中使用原生态类型
查看>>
团队项目开发客户端——登录子系统的设计
查看>>
【AppScan心得】IBM Rational AppScan 无法记录登录序列
查看>>
[翻译] USING GIT IN XCODE [4] 在XCODE中使用GIT[4]
查看>>
简化通知中心的使用
查看>>
IO—》Properties类&序列化流与反序列化流
查看>>
html 简介
查看>>
session如何保存在专门的StateServer服务器中
查看>>
react展示数据
查看>>
测试计划
查看>>
选择器
查看>>